<!-- 消息详情 -->
<template>
	<view class="content_box">
		<view class="title">{{infoData.title}}</view>
		<view class="time">{{infoData.createAt}}</view>
		<view class="c_data">
			<image :src='infoData.image' mode="widthFix" style="width: 690rpx;" @click="previewImageImage(infoData.image)"></image>
			<view v-html="infoData.content"></view>
		</view>
	</view>
</template>

<script>
	export default {
		components: {

		},
		data() {
			return {
				infoData:{}
			}
		},
		onLoad(option) {
			this.getInfo(option.id) 
		},
		methods: {
			previewImageImage(imgArr){
				uni.previewImage({
					urls: [imgArr],
					current: 0
				});
			},
			getInfo(id) {
				uni.showLoading({
					title: '加载中'
				})
	
				this.$u.api.messageInfo(id).then(res => {
					if (res.code == 0) {
						res.data.content.replace(new RegExp("img","g"),'img style="width:100%;height:auto;"')
						this.infoData = res.data
					} else {
						uni.showToast({
							title: res.msg,
							duration: 1000,
							icon: 'none'
						});
					}
					uni.hideLoading()
					uni.stopPullDownRefresh();
				})
			}
		},
		onReachBottom: function() {
			this.page = this.page + 1;
			this.getMsg()
		},
		onPullDownRefresh: function() {
			this.page = 1;
			// this.msgList = []
			this.getMsg()
		},
	}
</script>

<style lang="scss" scoped>
	page {
		background-color: #F7F8FF
	}
	.content_box{
		background-color: #fff;
		padding: 42rpx 30rpx 30rpx 30rpx;
		.title{
			font-weight: bold;
			font-size: 28rpx;
			color: #1A1A1A;
			padding-bottom: 10rpx;
		}
		.time{
			font-weight: 500;
			font-size: 22rpx;
			color: #CCCCCC;
			display: flex;
			justify-content: end;
			padding-bottom: 29rpx;
		}
	}
</style>